<template>
	<div class="left-search">
		<div class="search">
			<el-input placeholder="请输入内容" v-model="input" clearable @clear='clear'>
				<el-select v-model="select" slot="prepend" placeholder="请选择">
					<el-option label="设备编号" value="1"></el-option>
				</el-select>
			</el-input>
		</div>
		<div class="button" @click="search">
			搜索
		</div>
	</div>
</template>
<script>
import BMap from 'BMap'
export default {
  name: 'LeftSearch',
  data: function () {
    return {
			input: '',
			select: '1'
    }
  },

  methods: {
    search() {
			this.$emit('search', this.input)
		},
		clear() {
			this.$emit('search', this.input)
		}
  },
  computed: {
  },
  mounted() {
  }
}
</script>
<style lang="scss">
.left-search{
	position: absolute;
	left: 36px;
	top: 68px;
	width: 412px;
	height: 36px;
	
	.search{
		float: left;
		width: 320px;
		line-height: 36px;
		margin-top: -1px;
		box-shadow:5px 5px 0px 0px rgba(34,34,34,0.1);
		.el-input__icon{
			line-height: 0;
		}
		.el-input-group__prepend{
			
			background: #fff;
			border: 0;
			border-radius: 0;
			border-right: 1px solid #f2f2f2;
			.el-input__inner{
				width: 97px;
			}.el-input__suffix{
				right: 0;
			}
		}
		.el-input__inner{
			padding-left: 16px;
			height: 36px;
			border: 0;
			border-radius: 0;
		}
	}
	// 搜索按钮
	.button{
		float: right;
		width: 80px;
		height: 100%;
		line-height: 36px;
		text-align: center;
		color: #fff;
		background: #EB3838;
		font-size: 12px;
		box-shadow:5px 5px 0px 0px rgba(34,34,34,0.1);
		cursor: pointer;
	}
	.button:hover{
		background: #ff5858;
	}
	.button:active{
		background: #e03131;
	}
}
</style>
